import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

class MsgItem extends StatelessWidget {
  Map msginfo;
  String headimg;
  int sendStatus = 1; // 1发送成功 2发送中 0发送失败
  MsgItem({Key key, @required this.msginfo, this.sendStatus, this.headimg}):super(key:key);
  @override

  Widget renderMsgItem () {
    Widget msgCont;
    
    if (this.msginfo['type'] == 'text') {
      msgCont = Stack(
        children: <Widget>[
          Container(
            margin:EdgeInsets.fromLTRB(ScreenUtil().setWidth(29), 0, ScreenUtil().setWidth(29), 0),
            padding: EdgeInsets.all(ScreenUtil().setWidth(25)),
            decoration: BoxDecoration(
              color: this.msginfo['send_type'] == 1001 ? Color.fromRGBO(255, 255, 255, 1) : Color.fromRGBO(1, 136, 251, 1),
              borderRadius: BorderRadius.circular(13)
            ),
            child: Text(
              '${this.msginfo['content']}',
              textAlign: TextAlign.justify,
              style: TextStyle(
                color: this.msginfo['send_type'] == 1001 ? Colors.black : Colors.white,
                fontSize:ScreenUtil().setWidth(31), 
              ),
            ),
          ),
          Positioned(
            right: this.msginfo['send_type'] == 1001 ? null : ScreenUtil().setWidth(11),
            left: this.msginfo['send_type'] == 1002 ? null : ScreenUtil().setWidth(11),
            top: ScreenUtil().setWidth(15),
            child: ClipPath(
              clipper: this.msginfo['send_type'] == 1001 ? leftClipper() : rightClipper(),
              child: Container(
                width: ScreenUtil().setWidth(19),
                height: ScreenUtil().setWidth(20),
                color: this.msginfo['send_type'] == 1001 ? Color.fromRGBO(255, 255, 255, 1) : Color.fromRGBO(1, 136, 251, 1),
              ),
            ),
          )
        ],
      );
    }
    if (this.msginfo['send_type'] == 1001) {
      return Row(
        // mainAxisAlignment: MainAxisAlignment.end,
        crossAxisAlignment: CrossAxisAlignment.start,
        children: <Widget>[
          Container(
            width: ScreenUtil().setWidth(74),
            height: ScreenUtil().setWidth(74),
            decoration: BoxDecoration(
              shape: BoxShape.circle,
              image: DecorationImage(
                image: NetworkImage(
                  this.headimg == null ? 'https://ss0.baidu.com/6ONWsjip0QIZ8tyhnq/it/u=3463668003,3398677327&fm=58' : this.headimg
                ),
              ),
            ),
          ),
          ConstrainedBox(
            constraints: BoxConstraints(
              maxWidth: ScreenUtil().setWidth(500),
              minHeight: ScreenUtil().setWidth(81),
            ),
            child: msgCont,
          )
        ],
      );
    } else {
      return Row(
        mainAxisAlignment: MainAxisAlignment.end,
        crossAxisAlignment: CrossAxisAlignment.start,
        children: <Widget>[
          ConstrainedBox(
            constraints: BoxConstraints(
              maxWidth: ScreenUtil().setWidth(500),
              minHeight: ScreenUtil().setWidth(81),
            ),
            child: msgCont,
          ),
          Container(
            width: ScreenUtil().setWidth(74),
            height: ScreenUtil().setWidth(74),
            decoration: BoxDecoration(
              shape: BoxShape.circle,
              image: DecorationImage(
                image: NetworkImage(
                  this.headimg == null ? 'https://ss0.baidu.com/6ONWsjip0QIZ8tyhnq/it/u=3463668003,3398677327&fm=58' : this.headimg
                ),
              ),
            ),
          )
        ],
      );
    }

  }

  Widget build(BuildContext context) {
    return Container(
      margin: EdgeInsets.fromLTRB(ScreenUtil().setWidth(26), ScreenUtil().setWidth(29), ScreenUtil().setWidth(26), ScreenUtil().setWidth(29)),
      child: renderMsgItem(),
    );
  }
}

class rightClipper extends CustomClipper<Path> {
  @override
  Path getClip(Size size) {
    var path = Path();
    path.lineTo(0, size.height / 3);
    var firstControlPoint =Offset(size.width/3*2,size.height/3 - ScreenUtil().setWidth(2));
    var firstEndPoint = Offset(size.width,0);
    path.quadraticBezierTo(firstControlPoint.dx, firstControlPoint.dy, firstEndPoint.dx, firstEndPoint.dy);

    var secondControlPoint = Offset(size.width/3*2 + ScreenUtil().setWidth(3),size.height-ScreenUtil().setWidth(3));
    var secondEndPoint = Offset(0,size.height);
    path.quadraticBezierTo(secondControlPoint.dx, secondControlPoint.dy, secondEndPoint.dx, secondEndPoint.dy);
    path.lineTo(0, size.height);
    return path;
  }

  @override
  bool shouldReclip(CustomClipper<Path> oldClipper) {
    return false;
  }
}

class leftClipper extends CustomClipper<Path> {
  @override
  Path getClip(Size size) {
    var path = Path();
    path.lineTo(size.width, size.height / 3);
    var firstControlPoint =Offset(size.width/3,size.height/3 - ScreenUtil().setWidth(2));
    var firstEndPoint = Offset(0,0);
    path.quadraticBezierTo(firstControlPoint.dx, firstControlPoint.dy, firstEndPoint.dx, firstEndPoint.dy);

    var secondControlPoint = Offset(size.width/3 - ScreenUtil().setWidth(3),size.height-ScreenUtil().setWidth(3));
    var secondEndPoint = Offset(size.width,size.height);
    path.quadraticBezierTo(secondControlPoint.dx, secondControlPoint.dy, secondEndPoint.dx, secondEndPoint.dy);
    path.lineTo(size.width, size.height);
    path.lineTo(size.width, size.height / 3);
    return path;
  }

  @override
  bool shouldReclip(CustomClipper<Path> oldClipper) {
    return false;
  }
}